<template>
    <div   class="foot">
        <router-link v-for="(l,i) in flist" :key="i" :to="{name:l.name}"> 
            {{l.text}}
        </router-link>
    </div>
</template>
<script>
export default {
    data(){
        return {
            flist:[
                 {
                    path:"/main",
                    name:'main',
                    text:'首页',
                    icon:""
                },
                {
                    path:"/list",
                    name:'list',
                    text:'列表',
                    icon:""
                },
                {
                    path:"/find",
                    name:'find',
                    text:'朋友圈',
                    icon:""
                },
                {
                    path:"/mine",
                    name:"mine",
                    text:"我的",
                    icon:""
                },
                 {
                    path:"/vuex",
                    name:"vuex",
                    text:"vuex",
                    icon:""
                },
            ]
        }
    }
}
</script>

<style lang="scss" scoped>
.foot{
    padding: 20px;
    
  a {
    font-weight: bold;
    color: #2c3e50;
    margin:6px;
    &.router-link-exact-active {
      color: #42b983;
    }
  }
}
</style>